

* {
	font-family: 'Barlow Semi Condensed', sans-serif;
}

#body	{
  /*height:3000px;*/
  animation: all 0.5s ease;
  margin:0;
  padding:0;
  justify-content: center;
  display: flex;
}

.col.intro-col {
  justify-content: center !important;
  text-align: center !important;
}

.intro-col h1, 
.intro-col h2 {
  margin:5px;
}

.intro-col h2 {
  font-size:1.1em;
}

.col h3 {
  margin:0;
}

.page-section {
  position: fixed;
  display: flex;
  width: 100%;
  max-width:1000px;
  height: 100vh;
  animation: all 0.5s ease;
  flex-direction: column-reverse;
  justify-content: center;
}

.col {
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: flex-end;
  padding: 0 5% 0% 5%;
  flex-grow: 1;
  flex:1;
}

.page-section .col:first-child {
  justify-content: flex-start;
  padding: 5% 5% 0 5%;
}

.col * {
	width:100%;
  align-self: center;
}

.col a {
  color:inherit;
  text-decoration: none;
}

.col a:hover {
  text-decoration: underline;
} 

@media only screen and (min-width: 500px) {
  .page-section {
    flex-direction: row;
  }

  .page-section .col:first-child {
    justify-content: center;
    text-align: left;
  }

  .col {
    justify-content: center;
    padding: 5% !important;
    flex-direction: column;
  }

}

.profiler-img	{
	border-radius:50%;
	width:200px;
}

.project-img {
	width:300px;
	max-width:100%;
}

.hidden {
	display: none;
	-webkit-animation: fadeOut 0.5s /* Safari 4+ */;
  -moz-animation:    fadeOut 0.5s /* Fx 5+ */;
  -o-animation:      fadeOut 0.5s /* Opera 12+ */;
  animation:         fadeOut 0.5s /* IE 10+, Fx 29+ */;
}

.shown {
	/*display: initial;*/
	-webkit-animation: fadeIn 0.5s /* Safari 4+ */;
  -moz-animation:    fadeIn 0.5s /* Fx 5+ */;
  -o-animation:      fadeIn 0.5s /* Opera 12+ */;
  animation:         fadeIn 0.5s /* IE 10+, Fx 29+ */;
}

.svgicon {
  width:40px;
  margin:5px;
  margin-top:20px;
  display: inline-block;
}

.technologies {
  margin-top:15px;
  font-size:3em;
  flex-wrap:wrap;
}

.technologies i {
  max-width:20%;
  margin:5px;
}

#down-arrow {
  width:40px;
  margin-top:25px;
  position: relative;
  -webkit-animation: upDown 2s infinite /* Safari 4+ */;
  -moz-animation:    upDown 2s infinite /* Fx 5+ */;
  -o-animation:      upDown 2s infinite /* Opera 12+ */;
  animation:         upDown 2s infinite /* IE 10+, Fx 29+ */;
}

@-webkit-keyframes upDown {
  0%   { top: 0; }
  50% { top:10px; }
  100% { top:0; }
}
@-moz-keyframes upDown {
  0%   { top: 0; }
  50% { top:10px; }
  100% { top:0; }
}
@-o-keyframes upDown {
  0%   { top: 0; }
  50% { top:10px; }
  100% { top:0; }
}
@keyframes upDown {
  0%   { top: 0; }
  50% { top:10px; }
  100% { top:0; }
}


@-webkit-keyframes fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadeIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeOut {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
@-moz-keyframes fadeOut {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
@-o-keyframes fadeOut {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes fadeOut {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}